<template>
	<view>
		<cu-custom bgColor="bg-blue" :isBack="true">
			<block slot="backText">返回</block>
			<block slot="content">年终评价</block>
		</cu-custom>
		<van-cell-group>
			<van-field :value="inputForm.name" required label="姓名" readonly= true placeholder="请输入姓名" />
			<van-field :value="inputForm.institute" required label="学院" readonly= true placeholder="请输入学院"  />
			<van-field :value="inputForm.grade" required label="年级" readonly= true placeholder="请输入年级"  />
			<van-field :value="inputForm.classe" required label="班级" readonly= true placeholder="请输入班级"  />
			<van-field :value="inputForm.studentId" required label="学号" readonly= true placeholder="请输入学号" />
			<van-field :value="currentInstructor" required label="当前辅导员" readonly= true placeholder="请输入当前辅导员"  />
			<van-field :value="currentMoraleduPoint" required label="当前德育分" readonly= true placeholder="请输入当前德育分" />
			<van-cell title="家庭地址" is-link required :value="inputForm.address" @click="getAddress()" />
			<van-field :value="inputForm.telphone" required label="手机号码" id="telphone" @chan placeholder="请输入手机号码" @change="OnChange"/>
			<!-- <van-field :value="inputForm.relationship" required label="关系" id="relationship" placeholder="请输入您和孩子的关系" @change="OnChange"/> -->
			<van-cell title="关系" is-link required :value="inputForm.relationship" @click="showPopup()" />
			<van-popup :show="isShow" position="bottom">
				<van-picker :columns="columns" show-toolbar @cancel="onCancel" @confirm="onConfirm"/>
			</van-popup>
		</van-cell-group>
		<van-collapse :value="activeNames" @change="onChange()">
		  <van-collapse-item title="德育加分" name="1" >
		    <van-cell-group v-for="(item,index) in dataList">
		      <van-field
		        :value= item.addReason
				label="加分原因"
		        border = false
				disabled
		      />
			  <van-field
			    :value= item.addTime
			  	label="加分时间"
			    border = false
				disabled
			  />
			  <van-field
			    :value= item.addState
			  	label="审核状态"
			    border = false
			  	disabled
			  />
			  <van-field
			    :value= item.approver
			  	label="审核人"
			    border = false
			  	disabled
			  />
			  <van-field
			    :value= item.addPoint
			  	label="加分数"
			    border = false
			  	disabled
			  />
			  <van-image 
				lazy-load
				width="100" 
				height="100" 
				v-for="(src, indexs) in item.addEnclosure.split(',')" :key="indexs"
				:src= "`http://localhost:8082` + src"
				/>
		    </van-cell-group>
		  </van-collapse-item>
		  <van-collapse-item title="德育减分" name="2">
		    <van-cell-group v-for="(item,index) in dataSubList">
		      <van-field
		        :value= item.subReason
		    	label="减分原因"
		        border = false
		    	disabled
		      />
		      <van-field
		        :value= item.subPoint
		      	label="减分数"
		        border = false
		      	disabled
		      />
		    </van-cell-group>
		  </van-collapse-item>
		</van-collapse>
		<van-dialog id="van-dialog" />
		<button class="cu-btn block bg-blue margin-tb-sm lg" type="" @click="goto()">Tips: 点击进行签名</button>
		<button class="cu-btn block bg-blue margin-tb-sm lg" type="" @click="submit()" :disabled="isWrite">提交</button>
	</view>
</template>

<script>
	import { mapState } from 'vuex'
	import Dialog from '../../wxcomponents/vant/dist/dialog/dialog'
	export default {
		data() {
			return {
				inputForm: {
					id: '',
					name:'',		// 姓名
					institute:'',	// 学院
					grade:'',		// 年级
					classe:'',		// 班级
					studentId:'',   // 学号
					address: '',
					telphone:'',    //家长电话号码
					relationship:'', //与学生关系
					maximum: 999999,
					minimum:-9999999
				},
				flag: false, //判断是否可以提交
				columns: ['父子','母子','父女','母女','叔侄','其他'],
				isShow: false,
				isWrite: false,
				currentInstructor:'',		// 当前辅导员
				currentMoraleduPoint:'' ,// 目前德育分
				src: '',
				dataList: [], // 德育加分数组
				dataSubList: [], // 德育减分数组
				id: '',
				activeNames: [],
				fileurl: '',
			}
		},
		computed: mapState({
			 userInfo: (state) => state.user.userInfo
		  }),
		  onLoad(options) {
		  	this.fileurl = options.fileurl
		  },
		methods: {
			getAddress () {
				wx.chooseLocation({
				    success: function (res) {
						wx.setStorage({
							key: "address",
							data: res.address,
						})
				    }
				});
			},
			// 获取用户id
			getId () {
				this.$http.get('/studentevaluate/studentEvaluate/list?studentId=' + this.inputForm.studentId).then(({data}) => {
					if (data && data.success) {
						this.inputForm.id = data.page.list[0].id
						// console.log(this.inputForm.id)
					}
				})
			},
			// 数据验证
			check () {
				var number = /^[0-9]+.?[0-9]*/ // 验证字符串是否为数字
				if (this.inputForm.address === '') {
					uni.showToast({
						title: "请选择家庭地址!",
						icon: 'none'
					})
					//  || this.inputForm.telphone.length!=11
				} else if (this.inputForm.telphone === '' || this.inputForm.telphone.length!=11 || !number.test(this.inputForm.telphone)) {
					uni.showToast({
						title: "请输入正确的手机号码!",
						icon: 'none'
					})
				} else if (this.inputForm.relationship === '') {
					uni.showToast({
						title: "请选择关系!",
						icon: 'none'
					})
				} else {
					this.flag = true
				}
			},
			submit () {
				this.check()
				// console.log(this.fileurl)	
				if(this.flag){
					if (this.fileurl === undefined || this.fileurl === '') {
						uni.showToast({
							title: "请签名！",
							icon: 'none'
						})
					} else {
						console.log(this.inputForm)
						this.isWrite = true
						this.$set(this.inputForm, 'evaluate', "已评价")
						this.$set(this.inputForm, 'signature', this.fileurl) // 手写签名
						this.$set(this.inputForm,'telphone',this.inputForm.telphone)
						this.$set(this.inputForm,'relationship',this.inputForm.relationship)
						this.$http.post('/studentevaluate/studentEvaluate/save', this.inputForm).then(({data})=>{
							if (data.success) {
							Dialog.alert({
							  message: '提交成功!',
							}).then(() => {
							this.isWrite = false
							  uni.navigateTo({
								url: '/pages/index/index'
							  })
							})
							} else {
								uni.showToast({
									icon:"none",
									title:"提交失败！"
								})
							}
						})
					}
				}
				this.removeStorage()
			},
			showPopup () {
				this.isShow = true
			},
			onConfirm (event) {
				// console.log(event)
				const { picker, value, index } = event.detail
				// console.log(`当前值：${value}, 当前索引：${index}`)
				this.inputForm.relationship = value
				this.isShow = false
			},
			onCancel () {
				this.isShow = false
			},
			goto () {
				this.setStorage()
				uni.navigateTo({
					url: '/subPages/evaluate/csign'
				})
			},
			OnChange(event) {
				// console.log(event)
				let type = event.currentTarget.id
				this.inputForm[type] = event.detail
			},
			setStorage() {
				wx.setStorage({
					key: "telphone",
					data: this.inputForm.telphone,
				})
				wx.setStorage({
					key: "relationship",
					data: this.inputForm.relationship
				})
				wx.setStorage({
					key: "address",
					data: this.inputForm.address,
				})
			},
			// 查缓存
			getStorage() {
				var __this = this
				wx.getStorage({
					key: 'telphone',
					success(res) {
						__this.inputForm.telphone = res.data
					},
					fail(res) {}
				})
				wx.getStorage({
					key: 'relationship',
					success(res) {
						__this.inputForm.relationship = res.data

					},
					fail(res) {
						__this.reachable = true
					}
				})
				wx.getStorage({
					key: 'address',
					success(res) {
						__this.inputForm.address = res.data
				
					},
					fail(res) {
						__this.reachable = true
					}
				})
				console.log(this.inputForm.telphone)
			},
			// 清除缓存
			removeStorage () {
				wx.removeStorage({
				  key: 'telphone',
				  success: function(res) {
				  } 
				})
				wx.removeStorage({
				  key: 'relationship',
				  success: function(res) {
				  } 
				})
			},
			// 折叠面板点击事件
			onChange(event) {
			  this.activeNames = event.detail
			},
			onShow(){
				// this.clean()
				// this.setStorage()
				this.pullUser()
				this.refreshList()
				this.getId()
				this.getStorage()
			  },
			  //清空数据
			  clean(){
				  this.inputForm = {}
			  },
			  // 获取个人信息
			pullUser(){
				this.inputForm.name = this.userInfo.name
				this.inputForm.institute = this.userInfo.office.name
				this.inputForm.grade = this.userInfo.grade
				this.inputForm.classe = this.userInfo.classn
				this.inputForm.studentId = this.userInfo.no
			},
			// 获取数据列表
			refreshList(){
				this.$http.get('/moredumain/studentMoreduMain/list',this.inputForm).then(({data})=>{
					if (data && data.success) {
						this.id = data.page.list[0].id
						this.currentInstructor=data.page.list[0].currentInstructor
						this.currentMoraleduPoint = data.page.list[0].currentMoraleduPoint
						this.detail()
					}
				})
			},
			//获取详细信息
			detail () {
			  this.$http.get(`/moredumain/studentMoreduMain/queryById?id=` + this.id).then(({data}) => {
					this.dataList = data.studentMoreduMain.studentMoreduViceAddList
					this.dataList.map(item => {
						item.addState = this.$dictUtils.getDictLabel("audit_status", item.addState, '-')
					})
					this.dataSubList = data.studentMoreduMain.studentMoreduViceSubList
					
			  })
			}
		}
	}
</script>
